<template>
	<view>
		<view class="loading-wrap u-flex">
            <view class="progress"></view>
            <view>加载中 ...</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {

			}
		},
		methods: {

		}
	}
</script>

<style lang="scss" scoped>
    .loading-wrap {
        background-color: #FFFFFF;
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        z-index: 99999;
        justify-content: center;
        .progress {
            display: inline-block;
            width: 32rpx;
            height: 32rpx;
            border-radius: 50%;
            border: 2rpx solid gray;
            margin-right: 20rpx;
            border-bottom-color: transparent !important;
            vertical-align: middle;
            animation: loadingRotate 0.6s linear infinite;
        }
    }

    @keyframes loadingRotate {
    	0% {
    		transform: rotate(0deg);
    	}

    	100% {
    		transform: rotate(360deg);
    	}
    }
</style>
